@media screen  and (min-device-width: 200px) and (max-device-width:5000px) {

    #comment-section{
        width: 100%;
        height: 200rem;
        /*background: yellow;*/


    }


    #comment-section-popup-content{
        width: 50rem;
        height: 50rem;
        position: absolute;
        /*background: blue;*/
    }

    #comment-section-popup{
        /*height: 100%;*/
        height: 100%;
        position: sticky;

        top: 0;
        /*z-index: 1000;*/
    }

    #comment-section-content{
        width: 100%;
        /*height: 200rem;*/
        /*display: flex;*/
        /*flex-direction: column;*/
        /*background: #2c3e50;*/
    }
    .comment-section-content-item{
        display: flex;
        width: 100%;
        /*height: 70rem;*/
        min-height: 27rem;
        /*background: #0264e7;*/
        padding-top: 4rem;
        padding-bottom: 4rem;
        border-bottom: 0.1px solid #ebedf0;
        background: white;
        /*animation: opacityAnimation 1s infinite; !* 应用动画 *!*/

    }

    .comment-section-content-item-image{
        flex: 0 0 15rem;
        /*background: #0bc15f;*/
        display: flex;
        flex-direction: column;
        align-items: center;

    }
    .comment-section-content-item-card{
        /*flex: 1 1 20rem;*/
        /*!*background: #e37d0b;*!*/
        /*padding-right: 2rem;*/
        flex: 1 1 20rem;
        /*background: #e37d0b;*/
        padding-right: 3rem;
        overflow: hidden;

    }

    .comment-section-content-item-card-user{
        display: flex;
        flex-direction: column;
        height: 9rem;
        /*background: yellow;*/
    }
    .comment-section-content-item-card-user-name{
        font-size: 3.5rem;
        color:   #606266;
    }
    .comment-section-content-item-card-user-time{
        font-size: 3rem;
        color: #c8c9cc;
    }
    .comment-section-content-item-card-comment{
        display: flex;
        flex-direction: column;
        background: white;
    }
    .comment-section-content-item-card-comment-fonts{
        display: flex;
        height: 10rem;
        /*background: #0bc15f;*/
    }
    .comment-section-content-item-card-comment-font-m{
        flex: 1 1 11rem;
    }
    .comment-section-content-item-card-comment-font{
        flex: 0 0 17rem;
        display: flex;
        align-items: center;
        margin: 0 auto;
        font-size: 3.5rem;
    }
    .comment-section-content-item-card-comment-font-last{
        flex: 0 0 15rem;
        display: flex;
        align-items: center;
        margin: 0 auto;
        padding-left: 6rem;
    }
    .comment-section-content-item-card-comment-title{
        margin-top: 1rem;
        font-size: 4rem;
    }
    .comment-section-content-item-card-reply{
        display: flex;
        flex-direction: column;
        max-height: 40rem;
        /*height: 42rem;*/
        background:#e9e9eb;
        border-radius: 0.8rem;
        padding-left: 1rem;
        padding-top: 1rem;
        font-size: 3.7rem;
        margin-right: 2rem;

    }
    .comment-section-content-item-card-reply-name{
        color: #1989fa;
        overflow: hidden; /* 溢出隐藏 */
        text-overflow: ellipsis; /* 显示省略号 */

        display: -webkit-box;
        -webkit-box-orient: vertical;
        /*两行后省略*/
        -webkit-line-clamp: 2;
        margin: 0.5rem 0.5rem;

    }
    .comment-section-content-item-card-reply-more{
        font-size: 3.3rem;
        color: #1989fa;
        margin-right: 0.5rem;
        margin-bottom: 1rem;
    }
    .comment-section-content-item-card-reply-name-pl{
        color: black;
        /*display: inline-block;*/
    }
    .comment-section-content-item-card-reply-item{
        /*display: flex;*/
        /*flex-direction: column;*/
        /*background: #2c3e50;*/
        max-height:   38rem;
        overflow: hidden;
    }





}